【js-02】函数表达式和函数声明有什么区别?

分享人:张雪飞

目录

1.背景介绍

2.知识剖析

3.常见问题

4.解决方案

5.编码实战

6.扩展思考

7.参考文献

8.更多讨论

1.背景介绍

什么是Function Declaration(函数声明)?

Function Declaration 可以定义命名的函数变量,而无需给变量赋值。Function Declaration 是一种独立的结构,不能嵌套在非功能模块中。

就是使用function关键字声明一个函数,再指定一个函数名,叫函数声明

什么是Function Expression(函数表达式)?

Function Expression 将函数定义为表达式语句(通常是变量赋值)的一部分。通过 Function Expression 定义的函数可以是命名的,也可以是匿名的。Function Expression 不能以“function”开头。

使用function关键字声明一个函数,但未给函数命名,最后将匿名函数赋予一个变量,叫函数表达式

函数表达式存储在变量后,变量也可作为一个函数使用:

            
                var x = function (a, b) {return a * b};
                alert= x(4, 3);
            
            

以上函数实际上是一个 匿名函数 (函数没有名称)。 函数存储在变量中,不需要函数名称,通常通过变量名来调用。

                    
                        var x = function (a, b) {return a * b};
                        var z = x(4, 3);
                        alert= z;
                    
            

2.知识剖析

                
    // 函数声明
    function funDeclaration(type){
        return type==="Declaration";
    }
                
            
                
     // 函数表达式
    var funExpression = function(type){
        return type==="Expression";
    }
                
            

3.常见问题

一、什么是JavaScript函数?

二、两者具体有哪些区别呢?

4.解决方案

一、JavaScript函数。

函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

JavaScript 函数语法 函数就是包裹在花括号中的代码块,使用了关键词 function:


                function functionname()
                {
                执行代码
                }
            

当调用该函数时,会执行函数内的代码。 可以在某事件发生时直接调用函数(比如当用户点击按钮时),并且可由 JavaScript 在任何位置进行调用。 JavaScript 对大小写敏感。关键词 function 必须是小写的,并且必须以与函数名称相同的大小写来调用函数。

调用带参数的函数,在调用函数时,您可以向其传递值,这些值被称为参数。 这些参数可以在函数中使用。 您可以发送任意多的参数,由逗号 (,) 分隔:

                
                myFunction(argument1,argument2)
                
            

当声明函数时,把参数作为变量来声明:

                
                function myFunction(var1,var2)
                {
                代码
                }
                
            
                
                    

点击这个按钮,来调用带参数的函数。

demo

二、函数声明中函数名是必须的;函数表达式中则是可选的

                
    //函数声明
    function sum(a, b) {
        return a + b;
    }
    alert(sum(1, 2));
                
            
                
    //函数表达式
    var s = function sum(a, b) {
        return a + b;
    }
    alert(s(1, 2));

    var s = function(a, b) {
        return a + b;
    }
    alert(s(1, 2));
    //以上两种都可以
                
            

二、用函数声明定义的函数,函数可以在函数声明之前调用,而用函数表达式定义的函数只能在声明之后调用。

                
    //函数声明
    alert(sum(1, 2));//3
    function sum(a, b) {
        return a + b;
    }
                
            
                
    //函数表达式:发生错误
    try {
        alert(s(1, 2));
        var s = function sum(a, b) {
            return a + b;
        }
    }
    catch (e) {
        alert("wrong!");
    }
                
            

5.编码实战

6.扩展思考

使用function关键字声明一个函数,再指定一个函数名,叫函数声明。

function fn(){……}

使用function关键字声明一个函数,但未给函数命名,最后将匿名函数赋予一个变量,叫函数表达式。

var fn=function(){……}

使用function关键字声明一个函数,但未给函数命名,这个又称之为什么呢?是属于以上两种类型的哪一种?

function(){……}

匿名函数属于函数表达式,匿名函数有很多作用,赋予一个变量则创建函数,赋予一个事件则成为事件处理程序或创建闭包等等.

7.参考文献

参考一:函数声明与函数表达式以及立即执行函数的讨论

参考二:雨落川下雪

8.更多讨论

关于立即执行函数的讨论

也就是说只有函数表达式才能实现立即执行,匿名函数也是函数表达式为何不能立即执行呢, 因为匿名函数开始的function会被JavaScript引擎识别为函数声明的开始,所以加上括号也不会被执行了, 而加上(),!,+,- 等符号为什么就可以了呢,因为加上这些符号就可以告诉JavaScript引擎这不是函数声明了。

感谢观看

BY : 孙剑立